<%@ page import="com.google.appengine.api.users.User"%>
<%@ page import="com.google.appengine.api.users.UserService"%>
<%@ page import="com.google.appengine.api.users.UserServiceFactory"%>
<%@ page import="com.dddforandroid.classes.NotePad.Notes"%>
<%@ page import="com.dddforandroid.crud.PMF"%>
<%@ page import="javax.jdo.PersistenceManager"%>
<%@ page import="com.google.appengine.api.NamespaceManager"%>
<%@ page import="java.util.List"%>
<%@ page import="javax.jdo.Query"%>

<%@ page contentType="text/html;charset=UTF-8" language="java"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>D.D.D. For Android Demo</title>
<!--<link type="text/css" rel="stylesheet" href="style.css" />
-->
<!-- 	Copyright 2009 Itamar Arjuan
		jsDatePick is distributed under the terms of the GNU General Public License.
-->
<link rel="stylesheet" type="text/css" media="all" href="jsDatePick_ltr.min.css" />
<script type="text/javascript" src="jsDatePick.min.1.3.js"></script>
<!-- Java script handler for date choose-->
<script type="text/javascript">
    window.onload = function(){
        new JsDatePick({
            useMode:2,
            target:"date",
            dateFormat:"%d-%M-%Y"
        });
    };
</script>

<link type="text/css" rel="stylesheet" href="style.css" />
<script language="javascript" type="text/javascript" src="niceforms.js"></script>

</head>

<body>
	<div class="topbar">
		<div class="topbar-inner">
			<div class="container">
				<a class="brand" href="/">D.D.D. For Android Demo</a>
				<%
					UserService userService = UserServiceFactory.getUserService();
					User user = userService.getCurrentUser();

					if (user != null) {
						String LogoutUrl = userService.createLogoutURL(request
								.getRequestURI());
				%>
				<div class="pull-right">
					<ul class="nav">
						<li><a><%=user.getEmail()%></a></li>
						<li><a href="<%=LogoutUrl%>"> <img height="24px"
								width="24px" src="images/exit.png" alt="Logout" />
						</a></li>
					</ul>
				</div>
				<%
					} else {
						String LoginUrl = userService.createLoginURL(request
								.getRequestURI());
				%>
				<div class="pull-right">
					<ul class="nav">
						<li><a>Login with</a></li>
						<li><a href="<%=LoginUrl%>"> <img height="24px"
								width="24px" src="images/google.png" alt="Google login" />
						</a></li>
					</ul>
				</div>
				<%
					}
				%>
			</div>
		</div>
	</div>

	<%
			if (user != null) {
	%>
	
	<div style="position: relative;	width: 600px;height: 300px;margin: 55px 0 0 -300px;left:50%;z-index: 100;">
		<form action="AAction" method="post" class="niceform">
		    <fieldset>
		    	${errorMessage}
		    	<legend>Task</legend>
				<dl>
		        	<dt><label for="email">Name:</label></dt>
		            <dd><input type="text" name="name" id="name" size="32" maxlength="128" autocomplete="off" placeholder="Title..." value="${title}"/></dd>
		            <dd><input type="hidden" name="identifer" value="${id}"></dd>		            
		        </dl>
		        <dl>
		        	<dt><label for="note">Note:</label></dt>
		            <dd><textarea name="note" id="note" rows="5" cols="60" autocomplete="off" placeholder="Description...">${note}</textarea></dd>		            
		        </dl>
		        <dl>
		        	<dt><label for="date">Date:</label></dt>
		            <dd><input name="date" type="text" value="" class="text" id="date" size="10" autocomplete="off"/></dd>		            
		        </dl>
		        <dl>
		            <dd><input type="submit" name="submit" id="submit" value="Add" /></dd>
		        </dl>
		    </fieldset>
		</form>
	</div>
	<%
		/** Get the instance of the Database */
		PersistenceManager db = PMF.get().getPersistenceManager();
		/** Set the namespace for current user */
		NamespaceManager.set(user.getUserId());
		/** Get the database only for current user */
		Query query = db.newQuery("select from " + Notes.class.getName());
		List<Notes> list = (List<Notes>) query.execute();
	%>
	
	<div style="position: relative;	width: 600px;height: 300px;margin: 120px 0 0 -300px;left:50%;z-index: 100;">
		<form action="DUAction" method="post" class="niceform">	
		    <fieldset>
		    ${errorMes} 
		    	<legend>Current Tasks</legend>
		    	<%
		    		for ( int i = 0; i < list.size(); i++ ){
		    			String date = list.get(i).getCreatedDate().toString();
		    	%>	
				<dl>
		        	<dt>
			        	<label style="font-size:18px;" for="email">
							<a href="#" class="info"><%=list.get(i).getTitle()%>
								<span class="ttip"><%=list.get(i).getNote()%></span>
							</a>        	
			        	</label>
		        	</dt>	        
		        	<dt style="margin:0px 10px 10px 340px; width:150px">
		        		<label style="font-size:16px; text-align:right; float:right;"for="deadline">
				        	<%=date.substring(4, 10) + "/" + date.substring(date.length()-4, date.length())%>&nbsp;
				        	<input type="image" name="update" alt="edit" src="images/edit-icon.png" height="16px" width="16px" value="<%=list.get(i).getId()%>"/>&nbsp;
				        	<input type="image" name="delete" alt="delete" src="images/delete.png" height="16px" width="16px" value="<%=list.get(i).getId()%>"/>				        	
		        		</label>
	        		</dt>
		        </dl>
		        <%
		    		}
		    	%>
		    	
		    </fieldset>
		</form>
	
	<%}else{ %>
	
	<!-- TODO Add a welcome message + link to Android App -->
	
	<%} %>
	<p id="footer" style="text-align:center; color:#FFFF00">3D For Android<br />&copy;Ion Morozan - <a href="http://www.ionmorozan.blogspot.com/">Blog</a></p>
	</div>
</body>
</html>